<template>
  <a-form
    class="modal_form"
    :model="modalFrom"
    name="basic"
    :label-col="{ style: 'width: 120px' }"
  >
    <a-form-item label="弹出商品序号" extra="弹出指定序号的商品">
      <a-input-number v-model:value="modalFrom.serialNum" :min="1" />
    </a-form-item>

    <a-form-item label="触发间隔">
      <div style="display: flex; align-items: center">
        <a-input-number
          style="display: block; width: 120px"
          v-model:value="modalFrom.interval"
          :step="1"
          :min="1"
        >
          <template #addonAfter> s </template>
        </a-input-number>
        <div style="margin-left: 5px">
          {{ convertSecondToTime(modalFrom.interval).conText }}
        </div>
      </div>
    </a-form-item>
    <a-form-item label="延迟执行">
      <div style="display: flex; align-items: center">
        <a-input-number
          style="display: block; width: 120px"
          v-model:value="modalFrom.delay"
          :step="1"
          :min="0"
        >
          <template #addonAfter> s </template>
        </a-input-number>
        <div style="margin-left: 5px">
          {{ convertSecondToTime(modalFrom.delay).conText }}
        </div>
      </div>
    </a-form-item>
  </a-form>
</template>

<script setup lang="ts">
import { convertSecondToTime } from "../utils";

withDefaults(
  defineProps<{
    modalFrom?: any;
  }>(),
  {
    modalFrom: () => {},
  }
);
</script>

<style scoped lang="less"></style>
